<template>
	<view class="box">
		<uNavbar title="群信息修改" bgColor="transparent"></uNavbar>
		<view class="wrap_headimg" @click="getheadimg">
			<text>群头像</text>
			<image class="headimg" :src="imgurl" mode="aspectFill"></image>
		</view>
		<view class="wrap_item">
			<view class="text">群名称</view>
			<input type="text" maxlength="100" :disabled="is_admin==0" :style="{ color: inputColor }"  v-model="name"  />
			<uni-icons type="right" color="#A6A5AF" class="right" size="24"></uni-icons>
		</view>
		<view class="wrap_item"  v-if="is_admin!=0" @click="gomutelist">
			<view class="text">禁言列表</view>
			<view class="sex">
				
			</view>
			<uni-icons type="right" color="#A6A5AF" class="right" size="24"></uni-icons>
		</view>
		<view class="wrap_item"  v-if="is_admin!=0" @click="goadminlist">
			<view class="text">管理员列表</view>
			<view class="sex">
			</view>
			<uni-icons type="right" color="#A6A5AF" class="right" size="24"></uni-icons>
		</view>
<!-- 		<view class="wrap_item"  v-if="is_admin!=0">
			<view class="text">白名单列表</view>
			<view class="sex">
				
			</view>
			<uni-icons type="right" color="#A6A5AF" class="right" size="24"></uni-icons>
		</view> -->
<!-- 		<view class="wrap_item"  v-if="is_admin!=0">
			<view class="text">黑名单列表</view>
			<view class="sex">
				
			</view>
			<uni-icons type="right" color="#A6A5AF" class="right" size="24"></uni-icons>
		</view> -->
		<view class="wrap_item">
			<view class="text">群公告</view>
		</view>
		<view class="textareas">
			<text class="surplus">{{number||0}}/{{maxlength}}</text>
			<textarea class="ipt"   :disabled="is_admin==0" v-model.trim="signin" :maxlength="128"  placeholder="请输入群公告" />
		</view>
		<view class="btn" v-if="is_admin!=0" @click="submit">
			<image class="highlights"  src="../../static/image/mask.png" mode=""></image>
			保存
		</view>
		
	</view>
</template>

<script>

import {
		groupDetails,
		updateGroup
	} from "../../api/hx.js"
	import {baseURL} from "../../utils/request.js"
	export default {
		data() {
			return {
				name: '',
				show: false,
				
	
				signin: "",
				user:{},
				maxlength:'128',
				imgurl:"",
				sexval:"",
				number:'',
				inputColor: '#A7A4AD' ,// 初始状态为#fff
				groupid:"",
				detail:{},
				is_admin:""
			}
		},
		onLoad(option) {
			this.groupid=option.id
			this.getdetail()
		},
		watch:{
			signin(val){
				this.number = val.length
			}
		},
		methods: {
			gomutelist(){
				uni.navigateTo({
					url:"/pagesMy/chat/mutelist?id="+this.groupid
				})
			},
			goadminlist(){
				uni.navigateTo({
					url:"/pagesMy/chat/adminlist?id="+this.groupid
				})
			},
			leftClick() {
				//获取页面栈的长度
				const canNavBack = getCurrentPages()
				console.log(canNavBack.length);
				// 判断是否刷新了浏览器，刷新了浏览器，页面栈只有当前一个
				if (canNavBack.length > 1) {
					uni.navigateBack({
						delta: 1
					})
				} else {
					uni.switchTab({
						url: '/pages/index/index'
					})
				}
			},
			submit(){
				updateGroup({
					hx_group_id:this.groupid,
					group_name:this.name,
					avatar:this.imgurl,
					notice:this.signin
				}).then(res=>{
					if(res.code==1){
						setTimeout(()=>{
							uni.navigateBack()
						},1500)
					}
					uni.$u.toast(res.msg)
					console.log(res)
				})
			},
			getdetail(){
				groupDetails({
					hx_group_id:this.groupid
				}).then(res=>{
					if(res.code==1){
						this.detail=res.data
						this.is_admin=res.data.group_member_one.is_admin
						this.imgurl=res.data.avatar
						this.name=res.data.name
						this.signin=res.data.notice
					}
					console.log(res)
				})
			},
			getheadimg(){
				if(this.is_admin!=0){
					uni.chooseImage({
						count: 1,
						sizeType: ['original'],
						formData: {
							'user': 'test'
						},
						success: (chooseImageRes) => {
							console.log(chooseImageRes,"999")
							const tempFilePaths = chooseImageRes.tempFilePaths;
							uni.uploadFile({
								url: baseURL+`upload/uploadImg`,
								filePath: tempFilePaths[0],
								name: 'image',
								formData: {
								},
								success: (res) => {
									console.log(res,"99900")
									this.imgurl=JSON.parse(res.data).data.path
									console.log(this.imgurl,"图片")
									//  console.log(JSON.parse(res.data).data.path,"qwdqw") 
									// console.log(res,"上传")
								}
							});
						}
					});
					
				}

			},


		}
	}
</script>

<style lang="scss" scoped>
	.box {
		width: 750rpx;
		height: 1624rpx;
		background-color:#E0DDDA;
		
	}

	.wrap_headimg {
		width: 750rpx;
		height: 126rpx;
		position: relative;
		background-color: #E0DDDA;
		margin: 0 auto;
		margin-top: 20rpx;

		>text {
			position: absolute;
			top: 52rpx;
			left: 54rpx;
			font-size: 32rpx;
			color: #333;
		}

		.headimg {
			width: 94rpx;
			height: 94rpx;
			border-radius: 50%;
			position: absolute;
			top: 16rpx;
			right: 78rpx;
		}

		.uni-text {
			position: absolute !important;
			right: 0rpx !important;
		}
	}

	.wrap_item {
		width: 750rpx;
		height: 126rpx;
		position: relative;
		background-color: #E0DDDA;
		margin: 0 auto;
		display: flex;
		align-items: center;

		.text {
			position: absolute;
			// top: 52rpx;
			left: 54rpx;
			font-size: 32rpx;
			color: #333;
		}

		.sex {
			position: absolute;
			right: 100rpx;
			font-size: 32rpx;
			color: #A7A4AD;
		}

		.phone {
			position: absolute;
			right: 100rpx;
			font-size: 32rpx;
			color: #A7A4AD;

			>image {
				width: 24rpx;
				height: 24rpx;
				margin-right: 10rpx;
			}
		}

		.right {
			position: absolute;
			// top: 58rpx;
			right: 40rpx;
		}

		>input {
			position: absolute;
			// top: 52rpx;
			right: 92rpx;
			font-size: 32rpx;
			font-weight: 400;
			color: #fff;
			text-align: right;
			// background-color: red;
		}
	}

	.ipt {
		width: 654rpx;
		height: 304rpx;
		background: #f2f2f2;
		border-radius: 22rpx 22rpx 22rpx 22rpx;
		margin: 0 auto;
		font-weight: 400;
		font-size: 26rpx;
		color: #333 !important;
		padding: 32rpx;
	}

	.btn {
		position: relative;
		width: 690rpx;
		height: 80rpx;
		background: linear-gradient( 90deg, #AB8E68 0%, #D7BA93 100%);
		border-radius: 332rpx 332rpx 332rpx 332rpx;
		margin: 0 auto;
		margin-top: 50rpx;
		font-weight: 400;
		font-size: 36rpx;
		color: #FFFFFF;
		text-align: center;
		line-height: 88rpx;
	}
	.textareas{
		position: relative;
	}
	.textareas>textarea{
		font-size: 28rpx;
	}
	.surplus{
		position: absolute;
		bottom: 10rpx;
		right: 50rpx;
		font-size: 24rpx;
		color: #333;
		z-index: 999;
	}
	/deep/.uni-input-placeholder {
		color: #A6A5AF !important;
	}
</style>